<%--
  Created by IntelliJ IDEA.
  User: taohj
  Date: 2015/1/7
  Time: 14:04
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<div title="&nbsp;&nbsp;关系算法&nbsp;&nbsp; " data-options="closable:false" style="padding: 6px 6px 0 6px;">

  <div style="padding-left: 10px;border: 1px solid rgb(221,221,221);padding-top: 10px;  ">
    <div>选择</div>
    <div style="min-height: 40px;padding: 6px">
      <div>
        <a class="easyui-linkbutton" style="width: 60px" name="clusterers_choose">选择</a>&nbsp;<input
              id="clusterers_choose_view_input" class="easyui-textbox" type="text"
              style="width:400px;"/> <input name="clusterers_choose_classify_class" type="hidden"/>
      </div>


      <div>
        &nbsp;&nbsp;&nbsp;
        参数：
        <input class="easyui-textbox" type="text"  style="width: 600px" name="params">
        <a href="javascript:void(0)" onclick="">参数说明</a>
      </div>
    </div>
  </div>



  <div style="height: 450px;padding-left: 0px;float: left;margin-top: 10px;">





    <div style="padding: 0px 0 0 0;">
      <a id="clusterers_start_btn" class="easyui-linkbutton" style="width: 110px;margin-left: 8px;">开始</a>
      <a class="easyui-linkbutton" style="width: 110px;margin-left: 8px;">停止</a>
    </div>

    <div>
      <div style="padding: 6px 0 0 10px;height: 24px;">输出结果</div>
      <div>
        <input class="easyui-textbox" data-options="multiline:true,editable:false"
               style="width: 240px;height: 386px;">
      </div>
    </div>

  </div>

  <div style="width: 700px;float: right;border: 1px solid rgb(221,221,221);margin-top: 10px;padding: 4px">
    <div style="padding: 8px 0 0 10px;height: 24px;">分类器输出结果</div>
    <div>
      <%--  <input class="easyui-textbox" data-options="multiline:true,editable:false"
               id="clusterers_result_view_input"
               style="width: 100%;height: 400px; " >--%>


      <input class="easyui-textbox" data-options="multiline:true,editable:true"
             id="clusterers_result_view_input"
             style="width: 100%;height: 400px;">

      <%--  <div  id="classify_result_view_input"
              style="width: 100%;height: 400px;border: 1px solid rgb(221,221,221)">

        </div>--%>


    </div>
  </div>


</div>


<script>
  $(function () {

    var associateTab=context.tabs.tabs("getTab","关系算法");
    context.associateTab=associateTab;

    associateTab.find("a[name=clusterers_choose]").on("click", function () {
      var dialog = $("<div><div></div></div>");
      var tree = dialog.find("div");
      dialog.dialog({
        title: '选择算法',
        width: 400,
        height: 400,
        closed: false,
        cache: false,
        modal: true,
        top: 120,
        buttons: [
          {
            text: '确定',
            handler: function () {
              var node = tree.tree("getSelected");
              associateTab.find("input[name=clusterers_choose_classify_class]").val(node.id);
              var defalultParam = context.getDefalultParamsStr(associateTab, node.id);
              associateTab.find("#clusterers_choose_view_input").textbox("setValue", node.text + defalultParam);
              dialog.dialog("close");
            }
          },
          {
            text: '取消',
            handler: function () {
              dialog.dialog("close");
            }
          }
        ]
      });

      tree.tree({
        url: 'resources/js/data/associator.json'
      });

    });

    associateTab.find("input[name=params]").closest("div").find("a:last-child").on('click',function(){
      var title=associateTab.find("#clusterers_choose_view_input").textbox("getValue");
      var classes= associateTab.find("input[name=clusterers_choose_classify_class]").val();
      context.viewdocs(associateTab,title,classes);
    });



    // //聚类算法 开始按钮 点击事件
    associateTab.find("#clusterers_start_btn").on("click", function () {

      var clusterers_result_view_input = associateTab.find("#clusterers_result_view_input");
      clusterers_result_view_input.textbox("setValue", "");
      var associator = associateTab.find("input[name=clusterers_choose_classify_class]").val();

      var viewValue = associateTab.find("#clusterers_choose_view_input").textbox("getValue");
      var option = "";
      var index = viewValue.indexOf(" -");
      if (index > 1) {
        option = viewValue.substr(index);
      }

      $.post("associationsServlet", {action: "start", associator: associator,option:option}, function (data) {
        clusterers_result_view_input.textbox("setValue", data);
      });
    });




    $.get("resources/js/docs/associator.json", {}, function (data) {
      associateTab.params = data;
      var viewInput = associateTab.find("#clusterers_choose_view_input");
      var classInput = associateTab.find("input[name=clusterers_choose_classify_class]");
      context.setParams(associateTab, classInput, viewInput)
    }, "json");
  });
</script>